import React, { memo } from 'react';
import ASThemeHeaderRCM from '../../../../../../components/theme-header-rcm'
// import { useDispatch, useSelector, shallowEqual } from 'react-redux'
// import { getTopLists }  from '../../../../../../services/recommend'
// import { getTopListAction } from '../../store/actionCreators'
import { RankingWrapper } from './style';
import  ASTopRanking  from '../../../../../../components/top-ranking'

export default memo(function ASRecommendRanking() {
  
  // const { topLists }  =  useSelector(state => ({
  //   // topLists: state.getIn(['recommend', 'topLists'])
  //   topLists: state.get('recommend').get('topLists')
  // }), shallowEqual)

  // console.log(topLists)
  // const dispatch = useDispatch();

  // useEffect(() => {
  //   dispatch(getTopListAction())
  //   console.log(getTopListAction())
  // },[dispatch])

  // 其他hooks
  //    useEffect(() => {
  //   getTopLists().then(res => {
  //     // console.log(res)
  //   })
  // }, [])

  
  return (
    <RankingWrapper>
      <ASThemeHeaderRCM title="榜单" />
      <div className='tops'>
        <ASTopRanking></ASTopRanking>
        <ASTopRanking></ASTopRanking>
        <ASTopRanking></ASTopRanking>
      </div>
    </RankingWrapper>
  )
})
